<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<body>
<script type="text/javascript" src="/${initParam.context_root}/script/pscript5.js"></script>
<script type="text/javascript" src="/${initParam.context_root}/script/completePC[admin].js"></script>
<script type="text/javascript">
function getProductId(data){
	$(data).parent().next().html(data.value);
}

$(document).ready(function(){
	$("#reset").on("click", function(){
		$("#td1").html("");
		$("#td2").html("");
		$("#td3").html("");
		$("#td4").html("");
		$("#td5").html("");
		$("#td6").html("");
		$("#td7").html("");
		$("#td8").html("");
		$("#td9").html("");
		$("#td10").html("");
		$("#td11").html("");
		$("#td12").html("");
	});
});
</script>

<h2 align="center">컴퓨터조립</h2>
<div style="margin-left:110px";>
<form action="/droowa/product/registerPC.do" onsubmit="return chk(this)" method="post" encType="multipart/form-data">
<table>
<tr>
	<td valign="top">
		<table align="center">
		<tr><td width="244" id="picture"></td></tr>
		</table>
	</td>
	<td>
		<table align="center" border="1" style="border-collapse: collapse;">
			<tr style="border:1px; border-collapse:collapse; border-color: #EAEAEA">
				<td width="200" bgcolor="#BDBDBD">컴퓨터명</td>
				<td width="200">
					<input type="text" name="completeName" id="completeName" placeholder="컴퓨터명을 입력하세요" style="width:200px;">
				</td>
			</tr>
			<tr>
				<td bgcolor="#BDBDBD">가격</td>
				<td>
					<input type="text" name="completePrice" id="completePrice" placeholder="0" style="width:200px;">
				</td>
			</tr>
			<tr>
				<td bgcolor="#BDBDBD">수량</td>
				<td>
					<input type="text" name="completeQuantity" id="completeQuantity" placeholder="수량을 입력하세요" style="width:200px;">
				</td>
			</tr>
			<tr>
				<td>
					<select name="mainboardId" id="mainboardId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">메인보드</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='메인보드'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="mainboard"></td>
			</tr>
			<tr>
				<td>
					<select name="cpuId" id="cpuId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">CPU</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='CPU'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="cpu"></td>
			</tr>
			<tr>
				<td>
					<select name="coolerId" id="coolerId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">쿨러</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='쿨러'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="cooler"></td>
			</tr>
			<tr>
				<td>
					<select name="memoryId" id="memoryId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">RAM</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='RAM'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="memory"></td>
			</tr>
			<tr>
				<td>
					<select name="graphicId" id="graphicId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">그래픽카드</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='그래픽카드'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="graphic"></td>
			</tr>
			<tr>
				<td>
					<select name="hddId" id="hddId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">HDD</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='HDD'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="hdd"></td>
			</tr>
			<tr>
				<td>
					<select name="ssdId" id="ssdId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">SSD</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='SSD'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="ssd"></td>
			</tr>
			<tr>
				<td>
					<select name="dvdId" id="dvdId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">DVD</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='DVD'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="dvd"></td>
			</tr>
			<tr>
				<td>
					<select name="soundId" id="soundId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">사운드카드</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='사운드카드'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="sound"></td>
			</tr>
			<tr>
				<td>
					<select name="powerId" id="powerId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">파워</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='파워'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="power"></td>
			</tr>
			<tr>
				<td>
					<select name="caseId" id="caseId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">케이스</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='케이스'}">	
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="case"></td>
			</tr>
			<tr>
				<td>
					<select name="osId" id="osId" class="product" onchange="getProductId(this)" style="width:200px;">
						<option value="">OS</option>
						<c:forEach items="${requestScope.product_list}" var="product">
							<c:choose>
								<c:when test="${product.categoryName=='운영체제'}">
									<option value="${product.id}">
										${product.name}
									</option>
								</c:when>
							</c:choose>
						</c:forEach>
					</select>
				</td>
				<td align="center" id="os"></td>
			</tr>
			<tr>
				<td align="center">사진 업로드</td>
				<td>
					<input type="file" name="pic" style="width:200px;">
				</td>
			</tr>
			<tr align="right">
				<td colspan="2">
					<input type="hidden" value="false" name="event">
					<input type="reset" value="초기화" id="reset">
					<input type="submit" value="등록" style="width:60px;">		
				</td>
			</tr>
		</table>
	</td>
</tr>
</table>
</form>
</div>
</body>
